import React, { useState } from 'react';
import { Button, Input } from 'antd';
import { FilePond, registerPlugin } from 'react-filepond';
import 'filepond/dist/filepond.min.css';
import FilePondPluginFileValidateType from 'filepond-plugin-file-validate-type';

registerPlugin(FilePondPluginFileValidateType);

const FileToPdf: React.FC = () => {
  const [selectedFile, setSelectedFile] = useState<string | null>(null);

  const handleFileSelect = (files: File[] | null) => {
    if (files && files.length > 0) {
      setSelectedFile(files[0].name);
    } else {
      setSelectedFile(null);
    }
  };

  const handleEpubToPdf = () => {
    // 实现将 .epub 文件转换为 PDF 的逻辑
    console.log('Converting .epub to PDF:', selectedFile);
  };

  const handleMobiToPdf = () => {
    // 实现将 .mobi 文件转换为 PDF 的逻辑
    console.log('Converting .mobi to PDF:', selectedFile);
  };

  const handleAzwToPdf = () => {
    // 实现将 .azw 文件转换为 PDF 的逻辑
    console.log('Converting .azw to PDF:', selectedFile);
  };

  return (
    <div>
      <FilePond
        allowFileTypeValidation
        acceptedFileTypes={[
          'application/epub+zip',
          'application/x-mobipocket-ebook',
          'application/vnd.amazon.ebook',
        ]}
        onupdatefiles={handleFileSelect}
      />
      {selectedFile && <Input value={selectedFile} disabled />}
      <Button onClick={handleEpubToPdf} disabled={!selectedFile}>
        Epub 转 PDF
      </Button>
      <Button onClick={handleMobiToPdf} disabled={!selectedFile}>
        Mobi 转 PDF
      </Button>
      <Button onClick={handleAzwToPdf} disabled={!selectedFile}>
        AZW 转 PDF
      </Button>
    </div>
  );
};

export default FileToPdf;
